<template>
	<view class="main">
		<view class="info">
			<view class="head">
				<image :src="state.userInfo.avatar" mode=""></image>
				<view class="user">
					<view class="name">
						{{state.userInfo.nickname}}
					</view>
					<view class="num">
						剩余解锁次数：{{state.userInfo.num_ci}}
					</view>
				</view>
			</view>
			<view class="to_info" @click="router('../user/userinfo')">
				<text>个人信息</text>
				<image src="../../static/icon_more_zt.png" mode=""></image>
			</view>
		</view>
		<view class="list">
			<view class="" v-for="val,index in state.list" :key="index" @click="router(val.path,index)">
				<view class="block" >
					<view class="icons">
						<image :src="val.img" mode=""></image>
					</view>
					<view class="titles">
						<view class="tit">
							{{val.title}}
						</view>
						<view class="go">
							<image src="../../static/me_shezhi_icon_more@2x.png" mode=""></image>
						</view>
					</view>
				</view>
				<!-- <view class="block" v-else-if="index!=1">
					<view class="icons">
						<image :src="val.img" mode=""></image>
					</view>
					<view class="titles">
						<view class="tit">
							{{val.title}}
						</view>
						<view class="go">
							<image src="../../static/me_shezhi_icon_more@2x.png" mode=""></image>
						</view>
					</view>
				</view> -->
			</view>
		</view>
		<view class="list" style="margin-top: 24rpx;">
			<view class="block" v-for="val,index in state.list2" :key="index" @click="router(val.path)">
				<view class="icons">
					<image :src="val.img" mode=""></image>
				</view>
				<view class="titles">
					<view class="tit">
						{{val.title}}
					</view>
					<view class="go">
						<image src="../../static/me_shezhi_icon_more@2x.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<view class="button" @click="fabu">
			<image src="../../static/icon_bianji@2x.png" mode=""></image>
			<text>发布</text>
		</view>
	</view>
	<!-- 温馨提示 -->
	<view class="tan" v-if="state.teamShow">
		<view class="wen">
			<view class="wenTitle">
				温馨提示
			</view>
			<view class="ticen">
				您不具备此权限，请先联系客服为您开通
			</view>
			<view class="boten">
				<view class="shao" @click="state.teamShow=false">
					稍后联系
				</view>
				<view class="tuan" @click="router('/pages/index/chat')">
					联系客服
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import { reactive } from 'vue';
import sheep from '@/sheep';
import {onLoad,onShow} from '@dcloudio/uni-app';
	const state=reactive({
		list:[
			{
				img:'../../static/me_icon_dingdan@2x.png',
				title:'我的订单',
				path:'../user/order'+"?id=1"
			},
			{
				img:'../../static/me_icon_tuan@2x.png',
				title:'团长中心',
				path:'../user/team'
			},
			{
				img:'../../static/me_icon_jiesuo@2x.png',
				title:'解锁次数',
				path:'../user/unlock'
			},
			{
				img:'../../static/me_icon_koul@2x.png',
				title:'口令兑换',
				path:'../user/exchange'
			},
			{
				img:'../../static/me_icon_rz@2x.png',
				title:'个人认证',
				path:'../user/auth'
			},
			{
				img:'../../static/me_icon_daoyou@2x.png',
				title:'导游认证',
				path:'../user/tourGuide'
			},
			
		],
		list2:[
			{
				img:'../../static/me_icon_news@2x.png',
				title:'消息中心',
				path:'../index/message'
			},
			{
				img:'../../static/me_icon_kefu@2x.png',
				title:'联系客服',
				path:'/pages/index/chat'
			},
			{
				img:'../../static/me_icon_shezhi@2x.png',
				title:'设置',
				path:'../user/setUp'
			}
		],
		userInfo:{},
		teamShow:false,
	})
	// onLoad((options) => {
	// 	getuserInfo()//个人信息
	// });
	onShow((options) => {
		getuserInfo()//个人信息
	});
	// 个人信息
	async function getuserInfo() {
		const {code,data} = await sheep.$api.user.userInfo({
			token:uni.getStorageSync('token'),
		})
		if (code == 1) {
		   state.userInfo=data
		}
	}
	function fabu(){
		if(state.userInfo.fabu_id=='0'){
			uni.navigateTo({
				url:'../user/information?id='+state.userInfo.fabu_id+"&type=1"
			})
		}else{
			uni.navigateTo({
				url:'../user/homepage?id='+state.userInfo.fabu_id
			})
		}
	}
	function router(path,index){
		console.log(index,state.userInfo.auth_type)
		if(index==1){
			if(state.userInfo.auth_type==3){
				uni.navigateTo({
					url:path
				})
			}else{
				console.log('ssss')
				state.teamShow=true
			}
		}else{
			uni.navigateTo({
				url:path
			})
		}
		
	}
</script>

<style lang="scss">
	.tan{
		width: 100%;
		height: 100vh;
		background: rgba(0,0,0,0.4);
		position: fixed;
		top:0;
		left:0;
		z-index:9999;
		.wen{
			width:80%;
			margin:70% auto 0;
			background: #fff;
			border-radius: 24rpx;
			.wenTitle{
				width: 100%;
				text-align: center;
				line-height: 100rpx;
				font-size: 28rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #333333;
			}
			.ticen{
				width: calc(100% - 48rpx);
				padding:24rpx;
				text-align: center;
			}
			.boten{
			    width: 100%;
				overflow: hidden;
				line-height: 80rpx;
				border-top:1px solid #F3F6FA;
				display: flex;
				.shao{
					width: 49%;
					color:#999999;
					text-align: center;
					border-right:1px solid #F3F6FA;
				}
				.tuan{
					width: 49%;
					color:#1BDDD0;
					text-align: center;
					border-right:1px solid #F3F6FA;
				}
			}
		}
	}
page{
	height: 100%;
	width: 100%;
	background-color: #F5F5F5;
	.main{
		padding: 160rpx 32rpx 132rpx;
		// background-image: url(../../static/me_bg@2x.png);
		background: linear-gradient(135deg, #1BDDD0 0%, #1BDDD0 100%);
		background-repeat: no-repeat;
		background-size: 100% 400rpx;
		background-color: #F5F5F5;
		.info{
			display: flex;
			align-items: center;
			justify-content: space-between;
			.head{
				display: flex;
				align-items: center;
				image{
					width: 100rpx;
					height: 100rpx;
					border-radius: 50%;
					border: 4rpx solid #FFFFFF;
				}
				.user{
					margin-left: 24rpx;
					.name{
						font-size: 32rpx;
						font-family: PingFang SC-Bold, PingFang SC;
						font-weight: bold;
						color: #FFFFFF;
					}
					.num{
						font-size: 24rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #FFFFFF;
						margin-top: 8rpx;
					}
				}
			}
			.to_info{
				display: flex;
				align-items: center;
				text{
					font-size: 24rpx;
					font-family: PingFang SC-Medium, PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
					margin-right: 4rpx;
				}
				image{
					height: 32rpx;
					width: 32rpx;
				}
			}
		}
		.orders{
			padding: 24rpx;
			margin: 52rpx auto 24rpx;
			box-sizing: border-box;
			background-color: #fff;
			box-shadow: 0px 8rpx 8rpx 0px rgba(220,220,220,0.25);
			border-radius: 24rpx;
			.title{
				font-size: 32rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #333333;
				margin-bottom: 24rpx;
			}
			.orderlist{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.order{
					display: flex;
					flex-direction: column;
					align-items: center;
					image{
						height: 48rpx;
						width: 48rpx;
					}
					text{
						margin-top: 12rpx;
						font-size: 28rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #333333;
					}
				}
				
			}
		}
		.list{
			background: #FFFFFF;
			border-radius: 24rpx;
			margin-top: 54rpx;
			.block{
				display: flex;
				align-items: center;
				padding: 0rpx 24rpx;
				width: 100%;
				box-sizing: border-box;
				.icons{
					height: 48rpx;
					width: 48rpx;
					margin-right: 20rpx;
					image{
						height: 48rpx;
						width: 48rpx;
					}
				}
				.titles{
					width: calc(100% - 48rpx);
					display: flex;
					align-items: center;
					border-bottom: 2rpx solid #F5F5F5;
					justify-content: space-between;
					padding: 32rpx 0;
					.tit{
						font-size: 32rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #333333;
					}
					.go{
						height: 32rpx;
						width: 32rpx;
						// margin-left: auto;
						image{
							height: 32rpx;
							width: 32rpx;
						}
					}
				}
			}
		}
		.button{
			width: 100%;
			padding: 24rpx 280rpx;
			box-sizing: border-box;
			margin: 50rpx auto 32rpx;
			background: #FFFFFF;
			border-radius: 54rpx;
			border: 2rpx solid #333333;
			display: flex;
			align-items: center;
			image{
				height: 48rpx;
				width: 48rpx;
			}
			text{
				font-size: 32rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #333333;
				margin-left: 16rpx;
				white-space: nowrap;
			}
		}
	}
}
</style>
